import React, {Component} from 'react';
import {StyleSheet, Text, View, Image, ScrollView, ImageBackground} from 'react-native';
import {Button, WhiteSpace, WingBlank, Flex, Toast} from '@ant-design/react-native';
import {saveParkOrder} from '~/store/parkorder';
import {connect} from 'react-redux';
import {saveSystem} from '~/store/system';
import {getParkingPlanCarByItemID} from '~/api/parking';

const mapGetter = (state) => {
    return {
        userinfo: state.userinfo,
        system: state.system,
        parkorder: state.parkorder,
    };
};

const mapSetter = (dispatch) => {
    return {
        onSave: (data) => {
            dispatch(saveParkOrder(data));
        },
    };
};
class Getcar extends Component {
    static navigationOptions = {
        title: '得汽车',
    };
    constructor(props) {
        //调用基类的所有的初始化方法
        super(props);
        // 设置当前组件的属性
        this.state = {
            parkingid: this.props.parkingid,
            parkingplanitem: this.props.parkorder.parkingplanitem,
            itemID: this.props.navigation.getParam('itemID'),
            parkingplancar: [],
        };
        getParkingPlanCarByItemID(this.state.parkingplanitem.ParkingPlanItemID).then((r) => {
            if (r.code === 0) {
                this.setState({
                    parkingplancar: r.data,
                });
            } else {
                Toast.info(r.msg);
            }
        });
    }
    render() {
        return (
            <View style={{width: '100%', marginTop: 10}} justify={'center'}>
                <View style={{width: '92%', marginRight: '4%', marginLeft: '4%', marginBottom: 10}}>
                    <Flex
                        onPress={() => {
                            this.props.navigation.push('ParkGetCar', { parkingplancarID: this.state.parkingplancar.ParkingPlanCarID,});
                        }}
                        justify={'center'}
                        direction={'column'}
                        style={{
                            backgroundColor: 'white',
                            width: '100%',
                            padding: 20,
                            borderRadius: 5,
                        }}>
                        {this.state.parkingplancar.picList != null &&
                            this.state.parkingplancar.picList.map((item) => {
                                return (
                                    <Image
                                        style={{width: '100%', height: 200, resizeMode: 'contain'}}
                                        source={{uri: this.state.parkingplancar.HttpHead + '/' + item.FileName}}
                                    />
                                );
                            })}
                        <Flex style={{width: '100%', marginTop: 10}}>
                            <Text style={{fontSize: 14, fontWeight: 'bold'}}>汽车品牌： {this.state.parkingplancar.CarName}</Text>
                        </Flex>
                        <Flex style={{width: '100%', marginTop: 10}}>
                            <Text style={{fontSize: 14, fontWeight: 'bold'}}>汽车价值：</Text>
                            <Flex>
                                <Text style={{color: '#ec4f46', fontSize: 14, fontWeight: 'bold'}}>￥{this.state.parkingplancar.CarPrice}</Text>
                            </Flex>
                        </Flex>
                        <Flex style={{width: '100%', marginTop: 10, paddingBottom: 10, borderBottomWidth: 1, borderColor: '#F8F8FF'}}>
                            <Text style={{fontSize: 14, fontWeight: 'bold'}}>赠送规则：</Text>
                            <Text style={{fontSize: 12}}>
                                每<Text style={{color: '#ec4f46'}}>{this.state.parkingplancar.CarGroup}</Text>位业主送一辆
                            </Text>
                        </Flex>
                        <Flex style={{width: '100%', marginTop: 10}}>
                            <Text style={{fontsize: 10, color: 'gray'}}>备注：送车活动待购车位相关手续办理完成后择期举行</Text>
                        </Flex>
                    </Flex>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({});
export default connect(mapGetter, mapSetter)(Getcar);
